import { Button, Upload, Form, Input, Modal, message, UploadProps, InputRef } from 'antd';
import { ExclamationCircleFilled, InfoCircleOutlined } from '@ant-design/icons';
import { useState, useRef, useEffect, useMemo } from 'react';
import {
  CreateTokenizer,
  DeleteTokenizerById,
  ExistsTokeninerByName,
  CreateExtendWord,
  CreateDisableWord,
  DeleteExtendWord,
  DeleteDisableWord,
  CreateSynonymWord,
  DeleteSynonymWord,
  GetAnalyzerByText,
} from '../servers';
import { getMessage, TextWidget } from '@inbiz/react';
import { observer } from '@formily/react';
import { InbizIcon, request, downloadUtils } from '@inbiz/utils';
import { GlobalRegistry } from '@inbiz/core';

const { confirm } = Modal;
const { TextArea, Search } = Input;

const ButtonsHeader = observer((props: any) => {
  const { activeTab, selectLine, setSearch, tableRef, setSelectLine, search } =
    props;
  const [form] = Form.useForm();

  const ref = useRef<InputRef>();

  // 新建弹出框
  const [add, setAdd] = useState(false);

  // 导入弹出框
  const [open, setOpen] = useState(false);

  // 导出弹出框
  const [derive, setDerive] = useState(false);

  // 正则分词新建弹出框
  const [regularAdd, setRegularAdd] = useState(false);

  // 加载中
  const [loading, setLoading] = useState(false);

  // 正则测试结果
  const [analyzerText, setAnalyzerText] = useState([]);

  // 导入本地文件数据流
  const [fileList, setFileList] = useState<any>(null);

  // 多语言
  const synset = getMessage('WordSegmentationManagement.synset');
  const synonym = getMessage('WordSegmentationManagement.synonym');
  const extendedWord = getMessage('WordSegmentationManagement.extendedWord');
  const stopWord = getMessage('WordSegmentationManagement.stopWord');
  const regularName = getMessage('WordSegmentationManagement.regularName');
  const exist = getMessage('WordSegmentationManagement.exist');
  let stopSuccess2 = getMessage('WordSegmentationManagement.stopSuccess2');
  let stopSuccess3 = getMessage('WordSegmentationManagement.stopSuccess3');
  let stopSuccess4 = getMessage('WordSegmentationManagement.stopSuccess4');
  let extendSuccess2 = getMessage('WordSegmentationManagement.extendSuccess2');
  let extendSuccess3 = getMessage('WordSegmentationManagement.extendSuccess3');
  let extendSuccess4 = getMessage('WordSegmentationManagement.extendSuccess4');
  let synsetSuccess2 = getMessage('WordSegmentationManagement.synsetSuccess2');
  let synsetSuccess3 = getMessage('WordSegmentationManagement.synsetSuccess3');
  let synsetSuccess4 = getMessage('WordSegmentationManagement.synsetSuccess4');


  // 关闭
  const handleCancel = () => {
    setAnalyzerText([]);
    // 取消/关闭导入
    setOpen(false);
    setFileList(null);
    // 取消/关闭新增
    setAdd(false);
    // 取消/关闭导出
    setDerive(false);
    // 取消/关闭新建
    setRegularAdd(false);
  };

  // 新增分词器
  const handleOk = (callback?: Function) => {
    form.validateFields().then((_res: any) => {
      if (activeTab == 'synonym') {
        CreateSynonymWord(_res)
          .then((res: any) => {
            if(res?.Code==0){
                tableRef.current.getTableList();
              setAdd(false);
              message.success(
                getMessage('WordSegmentationManagement.newSuccessfullyCreated'),
              );
              callback && callback();
            }
            else if(res?.Code==2){
                form.setFields([
                {
                  name: 'KeyWord',
                  errors: [getMessage(
                    `WordSegmentationManagement.cannotBeEmpty`,
                    {
                      0: _res.KeyWord,
                    },
                  )]
                },
              ]);
            }else if(res?.Code==4){
                form.setFields([
                {
                  name: 'KeyWord',
                  errors: [`${_res.KeyWord}` + exist],
                },
              ]);
            } else {
                message.error(getMessage('WordSegmentationManagement.newFailed'));
              }

          })
          .catch((err: any) => {
            console.log(err);
          });
      } else if (activeTab == 'extendedWord') {
        CreateExtendWord(_res)
          .then((res: any) => {
            if(res?.Code==0){
              tableRef.current.getTableList();
            setAdd(false);
            message.success(
              getMessage('WordSegmentationManagement.newSuccessfullyCreated'),
            );
            callback && callback();
          }
          else if(res?.Code==2){
              form.setFields([
              {
                name: 'KeyWord',
                errors: [getMessage(
                  `WordSegmentationManagement.cannotBeEmpty`,
                  {
                    0: _res.KeyWord,
                  },
                )]
              },
            ]);
          }else if(res?.Code==4){
              form.setFields([
              {
                name: 'KeyWord',
                errors: [`${_res.KeyWord}` + exist],
              },
            ]);
          } else {
              message.error(getMessage('WordSegmentationManagement.newFailed'));
            }
          })
          .catch((err: any) => {
            console.log(err);
          });
      } else if (activeTab == 'stopWord') {
        CreateDisableWord(_res)
          .then((res: any) => {
            if(res?.Code==0){
              tableRef.current.getTableList();
            setAdd(false);
            message.success(
              getMessage('WordSegmentationManagement.newSuccessfullyCreated'),
            );
            callback && callback();
          }
          else if(res?.Code==2){
              form.setFields([
              {
                name: 'KeyWord',
                errors: [getMessage(
                  `WordSegmentationManagement.cannotBeEmpty`,
                  {
                    0: _res.KeyWord,
                  },
                )]
              },
            ]);
          }else if(res?.Code==4){
              form.setFields([
              {
                name: 'KeyWord',
                errors: [`${_res.KeyWord}` + exist],
              },
            ]);
          } else {
              message.error(getMessage('WordSegmentationManagement.newFailed'));
            }
          })
          .catch((err: any) => {
            console.log(err);
          });
      } else {
        CreateTokenizer(_res)
          .then((res: any) => {
            if (res?.Code == 0) {
              tableRef.current.getTableList();
              setRegularAdd(false);
              message.success(
                getMessage('WordSegmentationManagement.newSuccessfullyCreated'),
              );
              setAnalyzerText([]);
              callback && callback();
            } else if (res?.Code == 1) {
              form.setFields([
                {
                  name: 'TokenizerName',
                  errors: [
                    getMessage(
                      'WordSegmentationManagement.regularNameAlreadyExists',
                    ),
                  ],
                },
              ]);
            } else {
              message.error(res?.Msg);
            }
          })
          .catch((err: any) => {
            console.log(err);
          });
      }
    });
  };

  // 保存并新建
  const handleOKAdd = () => {
    handleOk(() => {
      setAdd(true);
      form.setFieldValue('KeyWord', '');
    });
  };

  // 测试
  const handleTest = () => {
    form.validateFields().then((res: any) => {
      GetAnalyzerByText(res)
        .then((_res: any) => {
        for(let i=0;i<_res.length;i++){
          _res[i]+='\n'
        }
            setAnalyzerText(_res.toString().replace(/,/g,''));
        })
        .catch((err: any) => {
          console.log(err);
        });
    });
  };
  useEffect(()=>{
    setAnalyzerText([])
  },[regularAdd])

  useEffect(() => {
    form.setFieldValue('TokenizerResult', analyzerText)
  }, [analyzerText])

  // 按下回车搜索
  const onPressEnter = (e: any) => {
    setSearch(e?.target?.value);
  };

  // 点击按钮搜索
  const onQuery = (value: any) => {
    setSearch(value);
  };


  // 判断分词器是否可用
  const ExistsTokeniner = (callback?: Function) => {
    if (selectLine?.length) {
      let _result = selectLine
        .map((item?: any) => item?.TokenizerName)
        ?.join(',');
      ExistsTokeninerByName(_result)
        .then((res: any) => {
          callback && callback(res);
        })
        .catch((err: any) => {
          console.log(err);
        });
    }
  };

  // 删除
  const showDeleteConfirm = () => {
    confirm({
      title: getMessage(
        `WordSegmentationManagement.areYouSureYouWantToDeleteTheSelected`,
        {
          0:
            activeTab == 'synonym'
              ? synset
              : activeTab == 'extendedWord'
                ? extendedWord
                : activeTab == 'stopWord'
                  ? stopWord
                  : regularName,
        },
      ),
      icon: <ExclamationCircleFilled />,
      centered: true,
      width: 400,
      className: 'inbiz-Word-segmentation-delModal',
      content: getMessage(
        'WordSegmentationManagement.afterEeletionTheRelevantDataWillNotBeRecoverable',
      ),
      okText: getMessage('WordSegmentationManagement.determine'),
      cancelText: getMessage('WordSegmentationManagement.cancellation'),
      onOk() {
        let params = {
          Id: selectLine?.map((item: any) => item?.Id)?.join(','),
        };

        if (activeTab == 'synonym') {
          DeleteSynonymWord(params)
            .then((res: any) => {
              if (res?.Code == 0) {
                setSelectLine([]);
                message.success(
                  getMessage('WordSegmentationManagement.successfullyDeleted'),
                );
                tableRef.current.getTableList(1);
              } else {
                message.error(
                  getMessage('WordSegmentationManagement.deleteFailed'),
                );
              }
            })
            .catch((err: any) => {
              console.log(err);
            });
        } else if (activeTab == 'extendedWord') {
          DeleteExtendWord(params)
            .then((res: any) => {
              if (res?.Code == 0) {
                setSelectLine([]);
                message.success(
                  getMessage('WordSegmentationManagement.successfullyDeleted'),
                );
                tableRef.current.getTableList(1);
              } else {
                message.error(
                  getMessage('WordSegmentationManagement.deleteFailed'),
                );
              }
            })
            .catch((err: any) => {
              console.log(err);
            });
        } else if (activeTab == 'stopWord') {
          DeleteDisableWord(params)
            .then((res: any) => {
              if (res?.Code == 0) {
                setSelectLine([]);
                message.success(
                  getMessage('WordSegmentationManagement.successfullyDeleted'),
                );
                tableRef.current.getTableList(1);
              } else {
                message.error(
                  getMessage('WordSegmentationManagement.deleteFailed'),
                );
              }
            })
            .catch((err: any) => {
              console.log(err);
            });
        } else {
          ExistsTokeniner((res: any) => {
            if (res.Code !== 0) {
              let selectValue = selectLine.map((item: any) => { return item.TokenizerName })
              selectValue.forEach((it: any) => {
                if (res.Msg.includes(it)) {
                  Modal.warning({
                    title: it + getMessage('WordSegmentationManagement.useing'),
                  });
                }
              })


            } else {
              DeleteTokenizerById(params)
                .then((res: any) => {
                  if (res.Code == 0) {
                    setSelectLine([]);
                    message.success(
                      getMessage(
                        'WordSegmentationManagement.successfullyDeleted',
                      ),
                    );
                    tableRef.current.getTableList(1);
                  } else {
                    message.error(
                      getMessage('WordSegmentationManagement.deleteFailed'),
                    );
                  }
                })
                .catch((err: any) => {
                  console.log(err);
                });
            }
          });
        }
      },
      onCancel() {
        console.log('Cancel');
      },
    });
  };

  // 导入
  const uploadProps: UploadProps = {
    onRemove: (file) => {
      setFileList(null);
    },
    beforeUpload: (file: Blob, onError) => {
      form.validateFields().then((res: any) => {
        const whiteType = ['text/plain'];
        if (!whiteType.includes(file.type)) {
          form.setFields([
            {
              name: 'file',
              errors: [
                getMessage(
                  'WordSegmentationManagement.onlySupportsUploadingTxtFiles',
                ),
              ],
            },
          ]);
          setFileList(file);
          return false;
        }
        return new Promise((resolve, reject) => {
          const reader = new FileReader();
          reader.onload = (res) => {
            const { result } = res.target; // 得到字符串
            let isOverstep = false; //字符数是否超出

            if (isOverstep) {
              resolve(null);
              setFileList(null);
            } else {
              if (!result) {
                message.error(getMessage('WordSegmentationManagement.fileEmpty'));
                // setFileList(null);
                return false;
              }
              resolve(result);
              setFileList(file);
            }
          }; // 成功回调
          reader.onerror = (err) => {
            onError(getMessage('WordSegmentationManagement.fileError'));
            reject(err);
          }; // 失败回调
          reader.readAsText(new Blob([file]), 'utf-8'); // 按照utf-8编码解析
        });
      });
      return false
    },
  };

  const handleUpload = () => {
    form.validateFields().then((res) => {
      if (!res?.file || !fileList) {
        form.setFields([
          {
            name: 'file',
            errors: [
              getMessage(`WordSegmentationManagement.cannotBeEmpty`, {
                0:
                  activeTab == 'synonym'
                    ? synset
                    : activeTab == 'extendedWord'
                      ? extendedWord
                      : stopWord,
              }),
            ],
          },
        ]);
      } else {
        var docname = res?.file.split('.');
        if (docname[docname.length - 1] != 'txt') {
          return;
        }
        const formData = new FormData();
        formData.append('file', fileList);
        let url =
          activeTab == 'synonym'
            ? '/search/IndexSynonym/SynonymImport'
            : activeTab == 'extendedWord'
              ? '/search/IndexExtent/ExtendImport'
              : '/search/IndexDisable/ExtendImport';
        request
          .post(url, {
            responseType: 'json',
            data: formData,
            useCache: false,
          })
          .then(function (data) {
            // 获取提示数字
            let numbers = data?.Msg?.match(/\d+(\.\d+)?/g)

            numbers?.forEach((item: number, index: number) => {
              if (activeTab == 'synonym') {
                synsetSuccess2 = synsetSuccess2.replace('${' + index + '}', item)
                synsetSuccess3 = synsetSuccess3.replace('${' + index + '}', item)
                synsetSuccess4 = synsetSuccess4.replace('${' + index + '}', item)
              } else if (activeTab == 'extendedWord') {
                extendSuccess2 = extendSuccess2.replace('${' + index + '}', item)
                extendSuccess3 = extendSuccess3.replace('${' + index + '}', item)
                extendSuccess4 = extendSuccess4.replace('${' + index + '}', item)
              } else {
                stopSuccess2 = stopSuccess2.replace('${' + index + '}', item)
                stopSuccess3 = stopSuccess3.replace('${' + index + '}', item)
                stopSuccess4 = stopSuccess4.replace('${' + index + '}', item)
              }
            })

            if (data.Code == 0) {
              message.success(getMessage('WordSegmentationManagement.importWasSuccessful'))
            } else if (data.Code == 1) {
              message.error(getMessage('WordSegmentationManagement.importFailed'))
            } else if (data.Code == 2) {
              message.success(
                activeTab == 'stopWord' ? stopSuccess2
                  : activeTab == 'extendedWord' ? extendSuccess2
                    : synsetSuccess2)
            } else if (data.Code == 3) {
              message.success(activeTab == 'stopWord' ? stopSuccess3
                : activeTab == 'extendedWord' ? extendSuccess3
                  : synsetSuccess3)
            } else if (data.Code == 4) {
              message.success(activeTab == 'stopWord' ? stopSuccess4
                : activeTab == 'extendedWord' ? extendSuccess4
                  : synsetSuccess4)
            }else{
              message.info(data.Msg);
            }
            setOpen(false);
            // 刷新数据
            tableRef.current.getTableList(1);
            setFileList(null);
          })
          .catch(function (error: any) {
            console.log(error);
          });
      }
    });
  };

  // 导出
  const handleExport = () => {
    form.validateFields().then((res: any) => {

      if (!res.fileName) {
        form.setFields([
          {
            name: 'fileName',
            errors: [getMessage('WordSegmentationManagement.fileNameCannot')],
          },
        ]);
        return;
      }
      let ids: any = [];
      if (selectLine?.length) {
        ids = selectLine?.map((item: any) => item?.Id).join(',');
      }
      let url =
        activeTab == 'synonym'
          ? `/search/IndexSynonym/SynonymWordExport?KeyWord=${search || ''
          }&ids=${ids}&FileName=${res?.fileName ? res?.fileName : '同义词'
          }`
          : activeTab == 'extendedWord'
            ? `/search/IndexExtent/ExtendWordExport?KeyWord=${search || ''
            }&ids=${ids}&FileName=${res?.fileName ? res?.fileName : '扩展词'
            }`
            : `/search/IndexDisable/DisableWordExport?KeyWord=${search || ''
            }&ids=${ids}&FileName=${res?.fileName ? res?.fileName : '停用词'
            }`;
      downloadUtils.downloadFile(url, (iframeDoc?: any) => {
        if (iframeDoc?.URL == 'about:blank' && iframeDoc?.referrer == '') {
          message.success(
            getMessage('WordSegmentationManagement.exportSuccessful'),
          );
        } else if (
          iframeDoc?.URL != 'about:blank' ||
          iframeDoc?.referrer != ''
        ) {
          message.error(getMessage('WordSegmentationManagement.exportFailed'));
        }
      });
      setDerive(false);
    });
  };

  // 多语言
  const TokenizerRule = useMemo(() => {
    return getMessage('WordSegmentationManagement.regularRules')
  }, [GlobalRegistry.getDesignerLanguage()])

  const suffix = (
    <InbizIcon
      type="icon-inbiz_basic-search"
    // onClick={() => onQuery(ref?.current?.input?.value)}
    />
  );

  const [searchValue, $searchValue] = useState('')
  const onSearch = (value: string) => { onQuery(value) }
  // 清空搜索条件
  useEffect(() => {
    onSearch('');
    $searchValue('')
  }, [activeTab]);

  return (
    <>
      <div className="word-segmentation-management-top-left">
        <Button
          onClick={
            activeTab == 'regularWordSegmentationConfiguration'
              ? () => setRegularAdd(true)
              : () => setAdd(true)
          }
          type="primary"
        >
          <InbizIcon type="icon-ic-tianjia" />
          {/* 新建 */}
          <TextWidget>WordSegmentationManagement.newBuilt</TextWidget>
        </Button>
        <Button
          onClick={showDeleteConfirm}
          disabled={selectLine.length ? false : true}
        >
          <InbizIcon type="icon-ic-tree-huishouzhan" />
          {/* 删除 */}
          <TextWidget>WordSegmentationManagement.delete</TextWidget>
        </Button>
        {activeTab == 'regularWordSegmentationConfiguration' ? (
          <></>
        ) : (
          <>
            <Button onClick={() => setOpen(true)}>
              <InbizIcon type="icon-daoru" />
              {/* 导入 */}
              <TextWidget>WordSegmentationManagement.import</TextWidget>
            </Button>

            <Button onClick={() => setDerive(true)}>
              <InbizIcon type="icon-daochu" />
              {/* 导出 */}
              <TextWidget>WordSegmentationManagement.export</TextWidget>
            </Button>
          </>
        )}
      </div>
      <div className="word-segmentation-management-top-right">
        <Input
          ref={ref}
          placeholder={getMessage(`WordSegmentationManagement.Enter`, {
            0:
              activeTab == 'synonym'
                ? synonym
                : activeTab == 'extendedWord'
                  ? extendedWord
                  : activeTab == 'stopWord'
                    ? stopWord
                    : regularName,
          })}
          onPressEnter={onPressEnter}
          onSearch={onSearch}
          value={searchValue}
          onChange={(e) => $searchValue(e.target.value)}
          style={{
            margin: '10px 0',
          }}
        />
        <InbizIcon
          type="icon-inbiz_basic-search"
          onClick={() => onQuery(ref?.current?.input?.value)}
        />
      </div>

      {/* 新建弹出框 */}
      {activeTab == 'regularWordSegmentationConfiguration' ? (
        <Modal
          title={getMessage('WordSegmentationManagement.newBuilt')}
          visible={regularAdd}
          onCancel={handleCancel}
          className="addModal"
          destroyOnClose={true}
          width={450}
          style={{ fontSize: '12px' }}
          bodyStyle={{
            padding: '21.5px 40px 0 33px',
            boxSizing: 'border-box',
          }}
          centered={true}
          footer={[
            <Button onClick={handleCancel}>
              <TextWidget>WordSegmentationManagement.cancellation</TextWidget>
            </Button>,
            <Button loading={loading} onClick={handleTest} >
              <TextWidget>WordSegmentationManagement.test</TextWidget>
            </Button>,
            <Button onClick={handleOk} type="primary">
              <TextWidget>WordSegmentationManagement.save</TextWidget>
            </Button>,
          ]}
        >
          <Form
            preserve={false}
            name={'basic' + activeTab}
            autoComplete="off"
            form={form}
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 17 }}
          >
            <Form.Item
              name="TokenizerName"
              label={getMessage('WordSegmentationManagement.regularName')}
              rules={[
                {
                  required: true,
                  message: getMessage(
                    `WordSegmentationManagement.cannotBeEmpty`,
                    {
                      0: regularName,
                    },
                  ),
                },
                {
                  max: 30,
                  message: getMessage(
                    'WordSegmentationManagement.cannotExceed30Characters',
                  ),
                },
              ]}
            >
              <Input
                placeholder={getMessage('WordSegmentationManagement.Enter1')}
              />
            </Form.Item>
            <Form.Item
              name="TokenizerRule"
              label={TokenizerRule}
              rules={[
                {
                  required: true,
                  message: getMessage(
                    'WordSegmentationManagement.regularRulesCannotBeEmpty',
                  ),
                },
              ]}
            >
              <Input
                placeholder={getMessage(
                  'WordSegmentationManagement.pleaseEnterARegularExpression',
                )}
              />
            </Form.Item>
            <Form.Item
              name="TokenizerDesc"
              label={getMessage('WordSegmentationManagement.describe')}
              rules={[
                {
                  max: 100,
                  message: getMessage(
                    'WordSegmentationManagement.cannotExceed100Characters',
                  ),
                },
              ]}
            >
              <Input
                placeholder={getMessage(
                  'WordSegmentationManagement.pleaseEnterADescription',
                )}
              />
            </Form.Item>
            <Form.Item
              name="text"
              label={getMessage('WordSegmentationManagement.testText')}
            >
              <TextArea
                placeholder={getMessage('WordSegmentationManagement.Enter1')}
                autoSize={{ minRows: 5 }}
              />
            </Form.Item>
            <Form.Item
              name="TokenizerResult"
              label={getMessage('WordSegmentationManagement.testResult')}
            >
              <TextArea
                placeholder={getMessage('WordSegmentationManagement.Enter1')
                }
                autoSize={{ minRows: 5 }}
              />
            </Form.Item>
          </Form>
        </Modal>
      ) : (
        // 同义词新建弹出框
        <Modal
          title={getMessage('WordSegmentationManagement.newBuilt')}
          className='inbiz-Word-segmentation-modal'
          visible={add}
          destroyOnClose={true}
          width={450}
          style={{ fontSize: '16px' }}
          bodyStyle={{
            padding: '25.184px 40px 0 33px',
            boxSizing: 'border-box',
          }}
          centered={true}
          onCancel={handleCancel}
          footer={[
            <Button onClick={handleCancel}>
              <TextWidget>WordSegmentationManagement.cancellation</TextWidget>
            </Button>,
            <Button loading={loading} onClick={handleOKAdd} >
              <TextWidget>
                WordSegmentationManagement.saveAndCreateNew
              </TextWidget>
            </Button>,
            <Button
            type="primary"
              onClick={() => {
                handleOk();
              }}
            >
              <TextWidget>WordSegmentationManagement.save</TextWidget>
            </Button>,
          ]}
        >
          {activeTab == 'synonym' ? (
            <Form
              name={'basic' + activeTab}
              autoComplete="off"
              form={form}
              preserve={false}
            >
              <Form.Item
                name="KeyWord"
                label={getMessage('WordSegmentationManagement.synset')}
                rules={[
                  {
                    required: true,
                    message: getMessage(
                      `WordSegmentationManagement.cannotBeEmpty`,
                      {
                        0: synset,
                      },
                    ),
                  },
                  // 不能只是一个词
                  {
                    validator: (_, value) => {
                      // 
                      let result = value?.split(',').filter((element: any) => {
                        return element !== '';
                      });
                      if (result && result?.length == 1) {
                        return Promise.reject(
                          new Error(
                            getMessage(
                              'WordSegmentationManagement.theSynonymSetCannotBeJustOneWord',
                            ),
                          ),
                        );
                      } else {
                        return Promise.resolve();
                      }
                    },
                  },
                ]}
              >
                <TextArea
                  placeholder={getMessage(
                    'WordSegmentationManagement.useEnglishCommasToSeparateSynonyms',
                  )}
                  style={{ fontSize: '14px' }}

                  autoSize={{ minRows: 5 }}
                />
              </Form.Item>
            </Form>
          ) : activeTab == 'extendedWord' ? (
            <Form
              name={'basic' + activeTab}
              autoComplete="off"
              form={form}
              preserve={false}
            >
              <Form.Item
                name="KeyWord"
                label={getMessage('WordSegmentationManagement.extendedWord')}
                rules={[
                  {
                    required: true,
                    message: getMessage(
                      `WordSegmentationManagement.cannotBeEmpty`,
                      {
                        0: extendedWord,
                      },
                    ),
                  },
                ]}
              >
                <TextArea
                  placeholder={getMessage(`WordSegmentationManagement.Enter`, {
                    0: extendedWord,
                  })}
                  autoSize={{ minRows: 5 }}
                />
              </Form.Item>
            </Form>
          ) : (
            <Form
              name={'basic' + activeTab}
              autoComplete="off"
              form={form}
              preserve={false}
            >
              <Form.Item
                name="KeyWord"
                label={getMessage('WordSegmentationManagement.stopWord')}
                rules={[
                  {
                    required: true,
                    message: getMessage(
                      `WordSegmentationManagement.cannotBeEmpty`,
                      {
                        0: stopWord,
                      },
                    ),
                  },
                ]}
              >
                <TextArea
                  placeholder={getMessage(`WordSegmentationManagement.Enter`, {
                    0: stopWord,
                  })}
                  autoSize={{ minRows: 5 }}
                />
              </Form.Item>
            </Form>
          )}
        </Modal>
      )}

      {/* 导入弹出框  */}
      <Modal
        title={[
          getMessage('WordSegmentationManagement.import'),
          <InfoCircleOutlined
            title={
              activeTab == 'synonym'
                ? getMessage('WordSegmentationManagement.hover1')
                : activeTab == 'extendedWord'
                  ? getMessage('WordSegmentationManagement.hover2')
                  : getMessage('WordSegmentationManagement.hover3')
            }
          />,
        ]}
        className="inbiz-Word-segmentation-importModal inbiz-Word-segmentation-modal"
        destroyOnClose={true}
        visible={open}
        width={450}
        onOk={handleUpload}
        style={{ fontSize: '12px' }}
        bodyStyle={{
          paddingTop: '25px',
          boxSizing: 'border-box',
        }}
        centered={true}
        onCancel={handleCancel}
        okText={getMessage('WordSegmentationManagement.determine')}
        cancelText={getMessage('WordSegmentationManagement.cancellation')}
      >
        <Form form={form} preserve={false} autoComplete="off">
          <Form.Item
            name="file"
            label={
              activeTab == 'synonym'
                ? synset
                : activeTab == 'extendedWord'
                  ? extendedWord
                  : stopWord
            }
          >
            {/* accept限制文件类型 */}
            <div style={{ display: 'flex', fontSize: '12px' }}>
              <Input
                readOnly
                id="fileName"
                style={{
                  background: '#f0f0f0',
                  borderColor: '#d6d6d6',
                  color: '#000000',
                  padding: '0 2px 0 10px',
                  margin: '0 15px 0 10px',
                }}
                placeholder={getMessage(
                  'WordSegmentationManagement.pleaseSelect',
                )}
                value={fileList != null ? fileList.name : ''}
              />

              <Upload
                {...uploadProps}
                showUploadList={false}
                withCredentials={false}
              >
                <Button >
                  <TextWidget>WordSegmentationManagement.select</TextWidget>
                </Button>
              </Upload>
            </div>
          </Form.Item>
        </Form>
      </Modal>

      {/* 导出弹出框 */}
      <Modal
        title={getMessage('WordSegmentationManagement.export')}
        className="inbiz-Word-segmentation-exportModal inbiz-Word-segmentation-modal"
        visible={derive}
        width={450}
        destroyOnClose={true}
        style={{ fontSize: '12px' }}
        bodyStyle={{
          paddingTop: '25px',
          boxSizing: 'border-box',
        }}
        centered={true}
        onOk={handleExport}
        onCancel={handleCancel}
        okText={getMessage('WordSegmentationManagement.determine')}
        cancelText={getMessage('WordSegmentationManagement.cancellation')}
      >
        <Form
          form={form}
          initialValues={{
            fileName:
              activeTab == 'synonym'
                ? getMessage('WordSegmentationManagement.synonym')
                : activeTab == 'extendedWord'
                  ? getMessage('WordSegmentationManagement.extendedWord')
                  : getMessage('WordSegmentationManagement.stopWord'),
          }}
          preserve={false}
        >
          <Form.Item
            name="fileName"
            label={getMessage('WordSegmentationManagement.fileName')}
          >
            {/* accept限制文件类型 */}
            <div style={{ display: 'flex', fontSize: '12px' }}>
              <Input
                id="fileName"
                style={{
                  // background: '#f0f0f0',
                  borderColor: '#d6d6d6',
                  color: '#000000',
                  // padding: '0 2px 4px 10px',
                  margin: '0 6px 0 10px',
                }}
                defaultValue={
                  activeTab == 'synonym'
                    ? getMessage('WordSegmentationManagement.synonym')
                    : activeTab == 'extendedWord'
                      ? getMessage('WordSegmentationManagement.extendedWord')
                      : getMessage('WordSegmentationManagement.stopWord')
                }
              />
            </div>
          </Form.Item>
        </Form>
      </Modal>
    </>
  );
});

export default ButtonsHeader;
